<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        body{
            margin: 0;
            xxxbackground-color: #000000;
        }
        #main {
            background-image: url(images/bg1.jpg);
            background-position: center;
        }
    </style>
</head>
<body>
<div id="main">
    asda
</div>
<script>
    //确保不出现滚动条
    var mainObj = document.getElementById('main');
    var v = getView();
    console.log(v);
    mainObj.style.height = v.y+'px';
    function getView() {
        if (document.compatMode == 'BackCompat'){
            //混杂，只在IE低版下才有
            return {x:document.body.clientWidth,y:document.body.clientHeight}
        } else {
            //标准
            return {x:document.documentElement.clientWidth,y:document.documentElement.clientHeight}
        }
    }
</script>
</body>
</html>